【Day4】安裝顏色套件/<link>結尾標籤

第 11 屆 iThome 鐵人賽

DAY 4

Modern Web

前端入門學徒-30天學習心路系列第 4 篇

11th鐵人賽

Judy

2019-09-08 22:38:45

818 瀏覽

分享至

1. 安裝顏色處理套件 colorpicker(快捷鍵 ctrl+shift+C)
(安裝步驟  ctrl+shift+P →install(選install pakage第一個)→輸入colorpicker→儲存→重新啟動sublime )
2. 啟動顏色套件 colorpicker
在colorpicker: 冒號後用快捷鍵 ctrl+shift+C
3. <link>沒有結尾標籤，是連接html和CSS的連結，放在<title>下
要連結外部css的檔案，需要在<head>標籤裡面加上哪一個html標籤呢?
Ans:<link>
4. 格式: <link rel="stylesheet" type="text/css" href="test.css">                             
每個屬性都要空一格
5. CSS裡面
標籤選擇器<p>(p是指是段落)
.是指class:類別選擇器
EX:
.text1{
	color: #0AB927;
}   
**注意:每個標籤結束後要有分號;**
6. 虛擬(偽類)選擇器 (非常好用)
a:link    有連結呈現的顏色
a:visited  點擊後呈現的顏色
a:hover   滑鼠滑到哪邊會改變顏色
    a:active  滑鼠點住不動時呈現的顏色
    text-decoration:none(去除文字底線)
7. id選擇器
id在CSS裡面顯示是# (而class則是.)
Ex:
#bggreen{
	background-color: #C7F3C6;
}
    上面給完底色，還須給高度跟寬度才能顯示
寬度 width: 200px
高度 height: 300px
8. id和class的區別:
id只能用一次，若要用多次→則改用class(記得CSS裡面也要把 #改成. )
id少用，只有在程式控制時

★ ctrl+Z 還原